<!DOCTYPE html>
<html lang="cn">
<head>
    <title>表单</title>
    <meta charset="UTF-8">
</head>
<body style="width: 50%; margin: auto;">
    <!--table-->
    <table border="1" cellspacing="0" cellpadding="10">
        <tbody>
        <th colspan="5">管沟宽度</th>
        <tr align="center">
            <td rowspan="2">测点位置</td>
            <td colspan="2">要挖宽度</td>
            <td colspan="2">实挖宽度</td>
        </tr>
        <tr>
            <td>上口实验宽度（m）</td>
            <td>沟底宽度（m）</td>
            <td>上口宽度（m）</td>
            <td>沟地宽度（m）</td>
        </tr>
        </tbody>
    </table>
    <br>
    <!--表格-->
    <table border="0" cellspacing="0" cellpadding="10">
        <thead>
            <tr>
                <th style="color: blue;">猜你喜欢</th>
                <th colspan="9" style="text-align: right; font-size: 18px;"><&bull; &bull; &bull;></th>
                </tr>
        </thead>
        <tbody>
            <tr>
                <td style="color: blue;">[游戏]</td>
                <td>超变态传奇</td>
                <td style="color: red;">1刀10000级</td>
                <td>贪玩蓝月</td>
                <td>复古传奇</td>
                <td>思美人</td>
                <td>一刀爆橙装</td>
                <td>装备RMB收</td>
                <td>神印王座</td>
                <td style="font-size: small; color: rgba(163,167,165,0.64);">换一换</td>
            </tr>
            <tr>
                <td style="color: blue;">[旅游]</td>
                <td>携程订票</td>
                <td>携程网机票</td>
                <td>携程旅行网</td>
                <td>携程官网</td>
                <td>携程旅行</td>
                <td>携程酒店</td>
                <td>特价秒杀</td>
                <td>艳遇圣地</td>
                <td style="font-size: small; color: rgba(163,167,165,0.64);">换一换</td>
            </tr>
            <tr>
                <td style="color: blue;">[生活]</td>
                <td>瓜子二手车</td>
                <td>卖车上瓜子</td>
                <td>人人车</td>
                <td>瓜子2手车</td>
                <td>人人车卖车</td>
                <td>二手车评估</td>
                <td>2手车瓜子</td>
                <td>高价卖车</td>
                <td style="font-size: small; color: rgba(163,167,165,0.64);">换一换</td>
            </tr>
        </tbody>
    </table>
    <br>
    <!--表格2-->
    <table border="1" cellspacing="0" width="800" cellpadding="2">
        <caption>某港口2007年生产统计表</caption>
        <tbody align="center" valign="middle">
            <tr>
                <td rowspan="3">月份</td>
                <td colspan="4">港口货物吞吐量（万吨）</td>
                <td colspan="4">港口集装箱吞吐量（万 TEU）</td>
            </tr>
            <tr>
                <td rowspan="2">本月数</td>
                <td colspan="3">累计</td>
                <td rowspan="2">本月数</td>
                <td colspan="3">累计</td>
            </tr>
            <tr>
                <td>本年</td>
                <td>上年同期</td>
                <td>比上年同期</td>
                <td>本年</td>
                <td>上年同期</td>
                <td>比上年同期</td>
            </tr>
            <tr>
                <td>1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>8.4%</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>15.2%</td>
            </tr>
            <tr>
                <td>2</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>8.4%</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>15.2%</td>
            </tr>
            <tr>
                <td>3</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>8.4%</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>15.2%</td>
            </tr>
            <tr>
                <td>4</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>8.4%</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>15.2%</td>
            </tr>
            <tr>
                <td>5</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>8.4%</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>15.2%</td>
            </tr>
            <tr>
                <td>6</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>872.1</td>
                <td>8.4%</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>8.4</td>
                <td>15.2%</td>
            </tr>
        </tbody>
    </table>
    <br>
    <!--表格3-->
    <table border="1" cellspacing="0" width="700" style="height: 250px;">
        <colgroup valign="top" span="5"></colgroup>
        <tbody align="center">
            <tr>
                <td rowspan="2" valign="center">人称</td>
                <td colspan="2" align="left">&emsp;&emsp;&emsp;单数</td>
                <td colspan="2" align="left">&emsp;&emsp;&emsp;复数</td>
            </tr>
            <tr>
                <td>主格</td>
                <td>宾格</td>
                <td>主格</td>
                <td>宾格</td>
            </tr>
            <tr>
                <td>第一人称</td>
                <td>i</td>
                <td>me</td>
                <td>we</td>
                <td>us</td>
            </tr>
            <tr>
                <td>第二人称</td>
                <td>you</td>
                <td>you</td>
                <td>you</td>
                <td>you</td>
            </tr>
            <tr>
                <td rowspan="3" valign="center">第三人称</td>
                <td>he</td>
                <td>him</td>
                <td rowspan="3" valign="center">they</td>
                <td rowspan="3" valign="center">them</td>
            </tr>
            <tr>
                <td>she</td>
                <td>her</td>
            </tr>
            <tr>
                <td>it</td>
                <td>it</td>
            </tr>
        </tbody>
    </table>
    <br>
    <!-- QQ注册-->
    <form action="https://www.baidu.com" method="post">
    <table style="height: 500px; " frame="box">
        <tbody>
            <tr>
                <td colspan="2" style="weight: 70px; font-size: 24px; font-weight: 800;">
                    欢乐注册QQ
                </td>
            </tr>
            <tr valign="top">
                <td width="150">每一天，乐在沟通。</td>
                <td align="right" width="200">免费靓号&nbsp;</td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="text" placeholder="&emsp;昵称" style=" height:30px; width: 350px; font-size: 18px; ">
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="password" placeholder="&emsp;密码" style=" height:30px; width: 350px; font-size: 18px; ">
                </td>
            </tr>
            <tr style="height: 40px;">
                <td>
                    <select style="height:35px; width: 120px; font-size: 18px; ">
                        <option>+86</option>
                        <option>+87</option>
                        <option>+82</option>
                    </select>
                </td>
                <td>
                    <input type="tel" pattern="\d{11}" placeholder="&emsp;手机号码" style=" height:30px; width: 200px; font-size: 18px; ">
                </td>
            </tr>
            <tr>
                <td colspan="2" valign="top" style="font-size: 12px; color: gray;">可通过该手机号找回密码</td>
            </tr>
            <tr>
                <td colspan="2"><input type="image" width="355" src="imges/ZhuCe.png"></td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="checkbox">同时开通QQ空间<br>
                    <input type="checkbox">我已阅读并同意相关服务条例和隐私政策
                </td>
            </tr>
        </tbody>
    </table>
    </form>
    <br>
    <!-- 找对象-->
    <h3 style="color: gray">10秒快速注册，找对象直营连锁更可靠</h3>
    <hr width="320" align="left">
    <form action="https://www.baidu.com" method="get">
        <table>
            <tbody>
                <tr>
                    <td>性别</td>
                    <td>
                        <input type="radio" name="sex" id="man" value="man"><label for="man">男</label>
                        <input type="radio" name="sex" id="girl" value="girl"><label for="girl">女</label>
                    </td>
                </tr>
                <tr>
                    <td>生日</td>
                    <td>
                        <select>
                            <option>1997</option>
                            <option>1998</option>
                            <option>1999</option>
                        </select>年
                        <select>
                            <option>1</option>
                            <option>2</option>
                            <option>3</option>
                        </select>月
                        <select>
                            <option>1</option>
                            <option>2</option>
                            <option>3</option>
                        </select>日
                    </td>
                </tr>
                <tr>
                    <td>所在地区</td>
                    <td>
                        <select>
                            <option>广东</option>
                            <option>浙江</option>
                            <option selected>江西</option>
                        </select>省
                        <select>
                            <option>抚州</option>
                            <option>赣州</option>
                            <option>南昌</option>
                        </select>市
                        <select>
                            <option>崇仁</option>
                            <option>宜黄</option>
                            <option>临川</option>
                        </select>县
                    </td>
                </tr>
                <tr>
                    <td> </td>
                    <td><input type="image" src="imges/ZhuCe.png" width="230"></td>
                </tr>
                <tr>
                    <td> </td>
                    <td style=" text-align: center; line-height: 10px; font-size: 14px;"><a href="#" style=" color: gray;">我是会员立即登陆</a></td>
                </tr>
            </tbody>
        </table>
    </form>
    <br>
    <!-- 语义化的调研问卷-->
    <form action="https://www.baidu.com" method="get">
        <fieldset style="width: 300px;">
            <legend>用户信息表</legend>
            <table>
                <tr>
                    <td>姓名：</td>
                    <td><input type="text"></td>
                </tr>
                <tr>
                    <td>年龄：</td>
                    <td><input type="number"></td>
                </tr>
                <tr>
                    <td>性别：</td>
                    <td>
                        <input type="radio" id="man2"><label for="man2">男</label>
                        <input type="radio" id="gril"><label for="gril">女</label>
                    </td>
                </tr>
                <tr>
                    <td>手机：</td>
                    <td>
                        <input type="tel" pattern="\d{11}">
                    </td>
                </tr>
                <tr>
                    <td>邮箱：</td>
                    <td>
                        <input type="email">
                    </td>
                </tr>
                <tr>
                    <td>爱好：</td>
                    <td>
                        <input type="checkbox" id="pa"><label for="pa">爬山</label>
                        <input type="checkbox" id="you"><label for="you">游泳</label>
                        <input type="checkbox" id="hua"><label for="hua">滑雪</label>
                        <input type="checkbox" id="shang"><label for="shang">上网</label>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="submit">
                    </td>
                </tr>
            </table>
        </fieldset>
    </form>
</body>
</html>